import 'dart:io';

import 'package:demo/base/app_color.dart';
import 'package:demo/base/app_size.dart';
import 'package:demo/base/hex_color.dart';
import 'package:demo/pages/second/filter_selector.dart';
import 'package:demo/pages/second/second_ctrl.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

class SecondPage extends GetView<SecondController> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: SafeArea(
        child: Padding(
          padding: const EdgeInsets.all(AppSize.none),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Expanded(
                child: imgShowWidget(),
              ),
              filterWidget(),
              actionWiget(),
            ],
          ),
        ),
      ),
    );
  }

  imgShowWidget() {
    return Stack(
      children: [
        Positioned(
          left: 0,
          right: 0,
          top: 0,
          bottom: 0,
          child: Obx(
            () => Padding(
              padding: EdgeInsets.fromLTRB(
                AppSize.normal.w,
                AppSize.normal.w,
                AppSize.normal.w,
                AppSize.none,
              ),
              child: ClipRRect(
                borderRadius: const BorderRadius.all(Radius.circular(50)),
                child: controller.imgPathObs.value.isNotEmpty
                    ? Image.file(
                        File(controller.imgPathObs.value),
                        color: controller.filterColor.value.withOpacity(0.5),
                        colorBlendMode: BlendMode.color,
                        fit: BoxFit.cover,
                      )
                    : Image.asset(
                        "assets/images/filter.png",
                        color: controller.filterColor.value.withOpacity(0.5),
                        colorBlendMode: BlendMode.color,
                        fit: BoxFit.cover,
                      ),
              ),
            ),
          ),
        ),
        Positioned(
          right: 40.w,
          bottom: 80.h,
          child: InkWell(
            onTap: () => controller.changeLightBtnState(),
            child: Container(
              width: 50.w,
              height: 100.w,
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.all(Radius.circular(25.w)),
              ),
              child: Obx(
                () => controller.lightBtnState.value == true
                    ? Image.asset(
                        "assets/images/vector_icon.png",
                        color: AppColors.blue(),
                      )
                    : Image.asset("assets/images/vector_icon.png"),
              ),
            ),
          ),
        ),
      ],
    );
  }

  filterWidget() {
    return Container(
      color: Colors.white,
      child: FilterSelector(
        onFilterChanged: (value) => controller.onFilterChanged(value),
        filters: controller.filters,
      ),
    );
  }

  actionWiget() {
    final imgSide = 45.w;
    return Container(
      height: 200.h,
      margin: EdgeInsets.only(bottom: AppSize.xLarge.h, top: AppSize.large.h),
      padding: EdgeInsets.symmetric(horizontal: 120.w),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          InkWell(
            onTap: () => controller.chooseLibray(),
            child: Image.asset(
              "assets/images/image_icon.png",
              width: imgSide,
              height: imgSide,
              fit: BoxFit.contain,
            ),
          ),
          InkWell(
            onTap: () => controller.chooseCamera(),
            child: Container(
              width: 180.w,
              height: 180.w,
              decoration: BoxDecoration(
                color: HexColor("#FFED90"),
                borderRadius: BorderRadius.all(Radius.circular(90.w)),
              ),
              alignment: Alignment.center,
              child: Container(
                width: 100.w,
                height: 100.w,
                decoration: BoxDecoration(
                  color: HexColor("#FFB800"),
                  borderRadius: BorderRadius.all(Radius.circular(75.w)),
                ),
                child: Image.asset(
                  "assets/images/camera_white.png",
                  width: imgSide,
                  height: imgSide,
                ),
              ),
            ),
          ),
          InkWell(
            onTap: () => controller.reloadPic(),
            child: Image.asset(
              "assets/images/change_icon.png",
              width: imgSide,
              height: imgSide,
              fit: BoxFit.contain,
            ),
          ),
        ],
      ),
    );
  }
}
